<template>
     <div id="box">
          <header>
               <ul>
               <a>
                 <li>北京市</li>
               </a>
               <a>
                 <li><img src="../assets/img/logo.png"></li>
               </a>
                <router-link to="/gonggao">
                 <li><img src="../assets/img/xiaoxi.png"></li>
               </router-link>
               </ul>
          </header>
          <section>
          
          <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="../assets/img/lunbo.png"/></div>
                <div class="swiper-slide"><img src="../assets/img/lunbo.png"/></div>
                <div class="swiper-slide"><img src="../assets/img/lunbo.png"/></div>
            </div>
          <!-- 如果需要分页器 -->
          <div class="swiper-pagination"></div>       
          
          
          <!-- 如果需要滚动条 -->
          <div class="swiper-scrollbar"></div>
        </div>
                 <div class="nav">
                 <router-link to="/gonggao2">
                     <p v-text="nav"></p>
                   </router-link>
                 </div>
                 <div class="menu">
                       <ul>
                       
                         <li>
                         <router-link to="/jijianyaofa">
                            <dl>
                              <dt><img src="../assets/img/shouye1.png"></dt>
                              <dd>
                                <p v-for="list in lists" v-html="list.text"></p>
                              </dd>
                            </dl>
                             </router-link>
                         </li>
                      
                         <li>
                          <router-link to="/paotui">
                           <dl>
                              <dd>
                                <p v-for="dd in dds" v-html="dd.text"></p>
                              </dd>
                            </dl>
                          </router-link>
                         </li>
                         <li>
                         <router-link to="/qianyueshangjiashenqing">
                           <dl>
                              <dt><img src="../assets/img/shouye2.png"></dt>
                              <dd>
                                <p v-for="lis in liss" v-html="lis.text"></p>
                              </dd>
                            </dl>
                          </router-link>
                         </li>
                         <li>
                         <router-link to="/zhanghuchongzhi">
                           <dl>
                              <dt><img src="../assets/img/shouye4.png"></dt>
                              <dd>
                                <p v-for="ls in lss" v-html="ls.text"></p>
                              </dd>
                            </dl>
                          </router-link>
                         </li>
                         <li>
                         <router-link to="/huochebanyun">
                           <p><img src="../assets/img/shouye3.png"></p>
                         </router-link>
                         </li>
                         <li>
                         <router-link to="/shangjiaruzhu">
                           <dl>
                               <dd>
                                <p v-for="la in las" v-html="la.text"></p>
                              </dd>
                            </dl>
                          </router-link>
                         </li>
                       </ul>
                 </div>
          </section>
          <footer>
              <ul>
              <router-link to="/shouye">
              <li><img src="../assets/img/foot_1.png"><p>首页</p></li>
            </router-link>
            <router-link to="/fujin">
                <li><img src="../assets/img/foot_2.png"><p>附近</p></li>
              </router-link>
              <router-link to="yiweiyuanshenqing">
                <li><img src="../assets/img/foot_3.png"></li>
              </router-link>
                <router-link to="/wodedingdan">
                <li><img src="../assets/img/foot_4.png"><p>订单</p></li>
              </router-link>
              <router-link to="/gerenzhongxin"> 
                <li><img src="../assets/img/foot_5.png"><p>我的</p></li>
              </router-link>
              </ul>
          </footer>
     </div>
</template>

<script>
   
   import".././assets/js/jquery-1.12.4.min.js"
export default {
  name: 'box',
  data () {
    return{
        nav:"公告：城市合伙人--火热加盟...(点击报名)",
        lists:[
             {text:"急件要发"},
             {text:"生鲜 水果 蛋糕"},
             {text:"证件 外卖 鲜花"},
             {text:"珠宝 宠物 ..."}

        ],
        dds:[
        {text:"跑腿·劳务·悬赏"},
        {text:"代购 维修 陪护 帮忙 保洁"},
        {text:"家政 陪玩 人力 发布任务"},
        ],
        liss:[
            {text:"签约商家"},
            {text:"签约服务"},
            {text:"价格自由定制"},
        ],
        lss:[
            {text:"一建发单"},
            {text:"价格定制"},
            
        ],
        las:[
            {text:"商家入驻"},
            {text:"包年、包月、承包制、价格等值"},
            {text:"物流合作"},
        ]
    }
  },
 mounted () {
      window.Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        autoplay : 1000,
        loop:true,
      })
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
   @import ".././assets/less/shouye.less";
   @import ".././assets/css/reset.css";
 
</style>